<template>
	<div class="article">
		<van-nav-bar :title="title" right-text="新建" fixed left-arrow @click-left="back" @click-right="createData" />

		<div class="content">
			<div class="list" v-for="item in articleList" :key="item.id">
				<div class="title">
					<div class="left">标题：</div>
					<div class="right">
						{{item.title}}
					</div>
				</div>
				<p class="time">发布时间：{{item.publishtime_text}}</p>
				<p class="source">
					<span>评论：{{item.comment}}</span>
					<span>发布者：{{item.user.nickname}}</span>
				</p>
				<div class="option">
					<div class="title">操作</div>
					<div class="button-group">
						<van-button color="#6A6A6A" plain @click="operation(item,1)" v-if="item.push==0">向上级推送</van-button>
						<van-button color="#6A6A6A" v-if="item.push==1">已推送</van-button>
						<van-button color="#6A6A6A" plain @click="operation(item,2)" v-if="item.publishdata==2">隐藏</van-button>
						<van-button color="#6A6A6A" plain @click="operation(item,2)" v-if="item.publishdata==1">发布</van-button>
						<van-button color="#6A6A6A" plain @click="operation(item,3)">编辑</van-button>
						<van-button color="#6A6A6A" plain @click="operation(item,4)">删除</van-button>
					</div>
				</div>
			</div>


		</div>
	</div>
</template>

<script>
	export default {
		name: "articlList",
		components: {

		},
		data() {
			return {
				title: this.$route.query.title,
				userInfo: {},
				page: 1,
				limit: 20,
				articleList: []


			}
		},
		mounted() {
			this.userInfo = JSON.parse(this.$getcookie("userInfo"))
			this.getList()
		},
		methods: {
			back() {
				this.$router.go(-1)
			},
			getList() {
				let askData = {
					user_id: this.userInfo.user_id,
					token: this.$getcookie("jy_token"),
					limit: this.limit,
					page: this.page
				}
				if (this.title == "收藏文章") {
					this.$api.my.collectList(askData).then(res => {
						// 执行某些操作
						if (res.code == 1) {
							this.articleList = res.data.data
						}

					})
				} else {
					this.$api.my.articleList(askData).then(res => {
						// 执行某些操作
						if (res.code == 1) {
							this.articleList = res.data.data
						}

					})
				}

			},
			operation(item, type) {
				let that = this
				let str = '编辑'
				if (type == 1) {
					str = "向上级推送"
				} else if (type == 2) {
					if (item.publishdata == 2) {
						str = "隐藏"
					} else {
						str = "发布"
					}

				} else if (type == 4) {
					str = "删除"
				}
				this.$dialog.confirm({
					title: '提示',
					message: '确定' + str + '?'
				}).then(() => {
					switch (type) {
						case 1:
							//向上级推送
							that.articlePush(item.id)
							break;
						case 2:
							//隐藏文章
							that.articleHide(item)
							break;
						case 4:
							//删除文章
							that.articleDelete(item)
							break;
						case 3:
							//编辑文章
							that.$router.push({
								path: "/release?id=" + item.id
							})
							break;
					}

					//隐藏
				}).catch(() => {
					// on cancel
				});

			},
			//新建发布文章
			createData() {
				this.$router.push({
					path: "/release?type=new"
				})
			},
			articlePush(id) {

				let pushData = {
					user_id: this.userInfo.user_id,
					token: this.$getcookie("jy_token"),
					article_id: id
				}
				this.$api.my.push(pushData).then(res => {
					// 执行某些操作
					if (res.code == 1) {
						this.$toast.success(res.msg)
						this.getList()
					} else {
						this.$toast.fail(res.msg)
					}

				})
			},
			articleHide(item) {
				let datas = 1
				if (item.publishdata == 1) {
					datas = 2
				} else {
					datas = 1
				}
				let pushData = {
					user_id: this.userInfo.user_id,
					token: this.$getcookie("jy_token"),
					article_id: item.id,
					publishdata: datas,
					site_id: item.site_id
				}
				this.$api.my.hide(pushData).then(res => {
					// 执行某些操作
					if (res.code == 1) {
						this.$toast.success(res.msg)
						this.getList()
					} else {
						this.$toast.fail(res.msg)
					}

				})
			},
			articleDelete(item) {
				let pushData = {
					user_id: this.userInfo.user_id,
					token: this.$getcookie("jy_token"),
					article_id: item.id,
					site_id: item.site_id
				}
				this.$api.my.delete(pushData).then(res => {
					// 执行某些操作
					if (res.code == 1) {
						this.$toast.success(res.msg)
						this.getList()
					} else {
						this.$toast.fail(res.msg)
					}

				})
			}
		}


	}
</script>

<style scoped lang="less">
	.article {
		padding-top: 46px;

		.van-nav-bar {
			.van-icon {
				color: #000;
			}

			.van-nav-bar__text {
				color: #5C5C5C;
			}
		}

		.content {
			background: #fff;
			margin-top: 0.59rem;
			padding: 1.19rem 0.94rem;

			.list {
				margin-bottom: 1rem;
				border-bottom: 1px solid #eee;
			}

			.title {
				display: flex;
				align-items: flex-start;
				justify-content: flex-start;
				font-size: 0.88rem;
				font-family: PingFang SC;
				font-weight: 500;
				color: rgba(0, 0, 0, 1);
				line-height: 1.25em;

				.left {
					white-space: nowrap;
				}
			}

			.time {
				font-size: 0.81rem;
				font-family: PingFang SC;
				font-weight: 500;
				color: rgba(106, 106, 106, 1);
				margin-top: 1.75rem;
				margin-bottom: 1.25rem;
			}

			.source {
				span {
					font-size: 0.81rem;
					font-family: PingFang SC;
					font-weight: 500;
					color: rgba(106, 106, 106, 1);
					margin-right: 1.78rem;
				}
			}

			.option {
				margin-top: 2rem;

				.title {
					font-size: 0.88rem;
					font-family: PingFang SC;
					font-weight: 500;
					color: rgba(0, 0, 0, 1);
					margin-bottom: 0.84rem;
				}

				.button-group {
					display: flex;
					align-items: center;
					justify-content: space-between;
					flex-wrap: wrap;
					padding: 0 1.22rem;

					.van-button {
						width: 9.25rem;
						height: 2.31rem;
						border: 1px solid rgba(254, 119, 0, 1);
						border-radius: 0.5rem;
						margin-bottom: 1rem;
						line-height: 2.31rem;
						font-size: 0.88rem;
						font-family: PingFang SC;
						font-weight: 500;
						color: rgba(106, 106, 106, 1);
					}
				}
			}
		}

	}
</style>
